Entering an Interactive World...
![skewed background pattern](https://framerusercontent.com/images/NwpFo6AuYsLhnizZDLSAKTJjmKI.webp)
![arrow device external button](https://framerusercontent.com/images/glzvGZMUkncX31YqotDNcpyQxYc.png)
![background shade](https://framerusercontent.com/images/QznZ0mEzq4sShbPIJiAyiIa7tY.webp?scale-down-to=1024)
![arrow dynamics typographic logo](https://framerusercontent.com/images/wjvnuoqsb4ciLLXhacKGq9fELYk.webp)
CUSTOM INTERACTIVE
ANIMATION LIBRARY FOR FRAMER
![top shade](https://framerusercontent.com/images/M13D6wmNFqIWywk9RAODQaLkma0.webp)
![battery percentage](https://framerusercontent.com/images/OyPd5vUphB3gDP93wFTNn2vHhP4.webp)
![voltage](https://framerusercontent.com/images/FFoNIfm67tbSGVZFV4QkEgdxc.webp)
![signal strength icon](https://framerusercontent.com/images/1iVKlTr8f8eysaYKPNnLf02UrM.webp)
![meter icon](https://framerusercontent.com/images/45OTSzMijJedSY81YDliSHi5BII.webp)
![reverse icon](https://framerusercontent.com/images/uzpYMP5nNOD7C3i81Dnqp4lZQbo.webp)
HOW IT WORKS
→ ARTWORK
GREENPRINT
![](https://framerusercontent.com/images/YHVPY8voO2CtRUCV3u0NYa9Y.webp)
![arrow inspiration icon](https://framerusercontent.com/images/mKXTrEkNF6cn3bLOMniMePxUQ5g.webp)
![skull icon](https://framerusercontent.com/images/GER7eM4TbWLuHH67Z145cqQ.webp)
![speaker grid](https://framerusercontent.com/images/N9JGE5J5ET9POq0fpcA8Mv3vLM.webp)
![](https://framerusercontent.com/images/5KtQxqzUFH00ymMOXUIZ4ShnDM.png)
![](https://framerusercontent.com/images/5KtQxqzUFH00ymMOXUIZ4ShnDM.png)
![](https://framerusercontent.com/images/5KtQxqzUFH00ymMOXUIZ4ShnDM.png)
![](https://framerusercontent.com/images/5KtQxqzUFH00ymMOXUIZ4ShnDM.png)
![](https://framerusercontent.com/images/5KtQxqzUFH00ymMOXUIZ4ShnDM.png)
![](https://framerusercontent.com/images/5KtQxqzUFH00ymMOXUIZ4ShnDM.png)
![](https://framerusercontent.com/images/5KtQxqzUFH00ymMOXUIZ4ShnDM.png)
![](https://framerusercontent.com/images/5KtQxqzUFH00ymMOXUIZ4ShnDM.png)
![](https://framerusercontent.com/images/5KtQxqzUFH00ymMOXUIZ4ShnDM.png)
![](https://framerusercontent.com/images/FfzG5L73XYpugNWI0foreV5uY.png)
![arrow dynamics icon](https://framerusercontent.com/images/Ty5dC2gsUC2Z2GPDHZQ5PNEE7NE.webp)
![](https://framerusercontent.com/images/yoFurLTLmatUCWvl8pLy3i9ThI0.webp)
![](https://framerusercontent.com/images/3kXxH5oXcFPCLM8YqfM3Cn7XX8.webp)
![](https://framerusercontent.com/images/AMs97NfYKTroE87VhkbDET6PRw.webp)
![shadow of hover dial](https://framerusercontent.com/images/uBwpkp5S7amagtYwiaHQAFlE4Ik.webp)
![hover dial](https://framerusercontent.com/images/4FDK45okS3XT658Mo4wTx6RLUOc.webp)
V1
V2
V3
AD 1.1
BY FRAMER.ZIP
![solar powered batter image](https://framerusercontent.com/images/L9K1TKZGfffXwIAvdJp0wNY928.webp)
![compass background](https://framerusercontent.com/images/dOgKVFeYraa0Pr1L0sytrDMEro.webp?scale-down-to=512)
![](https://framerusercontent.com/images/QtGFwAl1CaOhzDEhOEiyxIq4E4.webp)
![worldmap](https://framerusercontent.com/images/Gr7AvjvBjRwnM9Sxk8rvmD5hA.webp)
N
GENESIS
![](https://framerusercontent.com/images/r4sybvAU4r9emrhUtmge4ubb9s.png)
![](https://framerusercontent.com/images/KbmUObYB2wmL4LF9fDY8oYHwRs.png)
![](https://framerusercontent.com/images/r4sybvAU4r9emrhUtmge4ubb9s.png)
![](https://framerusercontent.com/images/y5q4GzZQSOwzt6R0X5iki2M4g.png)
![](https://framerusercontent.com/images/r4sybvAU4r9emrhUtmge4ubb9s.png)
![](https://framerusercontent.com/images/Vj39cKfuv3IPzT12E1CozDpLS2Q.webp)
AUTO-STABILIZERS
![three point marker line drawing](https://framerusercontent.com/images/VwMCHlPrSCamkUJN0T6nrY05Mc.webp?scale-down-to=512)
![](https://framerusercontent.com/images/AbPorLCA6cL9XgELlG3mFxsbgk.png)
![](https://framerusercontent.com/images/yU5ZUdcDdvJC7urLTQAWyCNkvb8.png)
![](https://framerusercontent.com/images/LBGilYpu9Zq4AF6RFGhVqnm6UEw.png)
![](https://framerusercontent.com/images/MHtClh7OSr7deL5AgsKxYMLWFio.png)
ARROW GALLERY
DEMOS
↪︎ SHOWING 4 OF 18
CRAZYMETER
TRUCHET LOOP
MORTYVERSE
SNOWFALL
GHOSTS
MADE USING ARROW DYNAMICS
![three dot microphone](https://framerusercontent.com/images/sNEdlRptYnXnAzFekiQWPg0BCE.png)
Build Interactive 2D Animations & Patterns in Framer
One Framer Code Component → 15 Variations → Infinite Possibilities
![background pattern](https://framerusercontent.com/images/uNuhmxzPwKYi7fzsdF7oYf4IYNU.png?scale-down-to=2048)
Accelerators
play = yes, interact = yes;
area = unconfined, def_speed = 0.1;
multiplier = 10, radius = 150;
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/gukPFWROFaJHrz7OEGBYPsCA.png)
![](https://framerusercontent.com/images/fKJqSjXZaW4xVy6xj49Me9SKY.png)
![](https://framerusercontent.com/images/EDdF53FHex03qQKCSd2snNQCD0.png)
![](https://framerusercontent.com/images/LF3fr5nq0mUXxSTUtz0lVjZvDo.png)
![](https://framerusercontent.com/images/ZIqSSJ8LnLDxiXYsVtVFmEaEg.png?scale-down-to=512)
![](https://framerusercontent.com/images/wTPoy8Wx3ovvPRmqEvwpphjdbA.png)
Layout Controls
![arrow dynamics framer interface of layout controls](https://framerusercontent.com/images/Eu4gNssgUuYte70XHiXVIpDgsKw.png)
Object Controls
![arrow dynamics framer interface of layout controls](https://framerusercontent.com/images/itfaw5wVtGW4VmnULXvqIseROBg.png)
![arrow dynamics framer interface of layout controls](https://framerusercontent.com/images/3b8XWJ1YyiVkS7g4gETVpvFvD2w.png)
Text, Images, GIFs, URLs
Motion Controls
![arrow dynamics framer interface of motion controls](https://framerusercontent.com/images/lvgWF2XgKnA2ija7RdZCim939sk.png)
![arrow dynamics framer interface of variation switch](https://framerusercontent.com/images/nxQ8CsHqx1TTD11CDk07q1NKrgQ.png)
One Click
Switch
14 Unique Variations
Special Dynamics
INTERACTIVE VISUALIZATION OF THE COMPONENT
Arrow Dynamics – All Variations
Variations with ° are interactive
Accelerators
°
Accelerates objects within a radius around the pointer arrow
Amplifiers
°
Amplifies objects within a radius around the pointer arrow
Convergers
°
Rotates individual objects to converge towards the pointer arrow
Decelerators
°
Decelerates objects within a radius around the pointer arrow
Entropists
°
Objects increase their entropy under the arrow and lowers when away
Ferromancers
Objects emulate a compass needle movement in zero magnetic field
Gravitators
°
Increases gravity within a radius around the pointer arrow
Harmonizers
Objects loop in Y-axis in a harmonised orientation
Listeners
°
Objects never listens to the pointer arrow
Oscillators
°
Objects oscillate collectively around the pointer arrow
Polarizers
°
Objects change their polarity on click or hover
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
![](https://framerusercontent.com/images/fbS8rq598dh026k0P1NIfTsGc4.png)
Resonators
°
Objects resonate collectively around the pointer arrow
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
![](https://framerusercontent.com/images/syeq01iHlLtqgH67LMTvQhvEaE.png)
Stoics
°
Objects behave however they want
Vermiformers
Objects behave like microorganisms under a microscope
Warriors
Objects march like warriors towards a particular cardinal direction
![](https://framerusercontent.com/images/VOnH9ZkAfCaxeGAnIJT3xgj82k.webp)
![](https://framerusercontent.com/images/uuXBYAJ2iqz2zqifK7d2lg4hg0.webp)
Get Trial Component
3 Variations, Limited Property Controls
![background pattern](https://framerusercontent.com/images/Do6KlQeukm6SFM8OLgiR1ZJ0cso.webp?scale-down-to=2048)
Basic
$19
$28
Arrow Dynamics Component + Framer Remixes of Arrow Gallery Demos (3 Sites)
Arrow Dynamics Framer Component (All Variations)
✓
Arrow Gallery Demos * → Framer files
✓
Lifetime free updates and fixes to the Component
✓
License → Personal projects only
✓
Pro
$196
$280
Arrow Dynamics Component + Fully editable Framer and Figma files of the Arrow Dynamics Website
Arrow Dynamics Framer Component (All Variations)
✓
Arrow Gallery Demos * → Framer + Figma files
✓
Arrow Dynamics Full Website → Framer + Figma files
✓
All Framer.zip code overrides used in the Website
✓
Lifetime free updates and fixes to the Component
✓
License → Personal + Client projects
✓
Use Promo code ARROW → 30% off
* Sites included: Quiver of Arrows, Orbs, Truchet Tiles
One time purchase • 100% Fun • Payments via LemonSqueezy
![pricing display box](https://framerusercontent.com/images/uDhjphTViXbgfG4aEXcbAtm9s.webp)
Pricing
What is Arrow Dynamics
How do I add Arrow Dynamics to my Framer site?
What will I get on purchase?
Can I edit the code?
Can I include the component in Framer Templates / Remixes?
![](https://framerusercontent.com/images/IzTjQkXK9zlYap7v5TzXLT1tyo.webp)
View all FAQs
![](https://framerusercontent.com/images/0JSWudzhkwDw9ZnWasAL8cmodo.webp?scale-down-to=2048)
![framerzip vinyl player](https://framerusercontent.com/images/DkY3xBmCosBcALZLS3RXZZ6M.webp?scale-down-to=2048)
![vinyl disc](https://framerusercontent.com/images/rT5a6fSayDuTVEEIuy6lFtzZzjY.webp?scale-down-to=1024)
![vinyl player handle](https://framerusercontent.com/images/3rFZZmziAmJ3K0bbeAzJ9jSr1TU.webp?scale-down-to=1024)
![](https://framerusercontent.com/images/5KtQxqzUFH00ymMOXUIZ4ShnDM.png)
![](https://framerusercontent.com/images/5KtQxqzUFH00ymMOXUIZ4ShnDM.png)
![](https://framerusercontent.com/images/xn3BWTUR24cVCSsfLmEoUwit54s.webp?scale-down-to=1024)
Quiver of Arrows
Interactive animations that make creative use of Arrow Dynamics
![vinyl disc](https://framerusercontent.com/images/A0L9x5uwYT7IMYfobhp5A6aLQ.webp)
Orbs
Interactive glass orbs built using multiple variations of Arrow Dynamics
![vinyl disc](https://framerusercontent.com/images/YTHIHddAFcZJt9HsFp4OQtNU.webp)
Truchet Tiles
Seamless Truchet patterns built using the Polarizers variation
The Arrow Gallery
Creative uses of Arrow Dynamics Component
More Demos Coming Soon...
Special Dynamics
Interactive Components
![](https://framerusercontent.com/images/5KtQxqzUFH00ymMOXUIZ4ShnDM.png)
![](https://framerusercontent.com/images/b4Mu2te8Qvbc0FvemJNgWDoSXk.png)
![](https://framerusercontent.com/images/EG2R0nbPI6tlH0DFWy37LXB0.png)
![arrow dynamics framer interface of object controls](https://framerusercontent.com/images/RmBBLFoS92XrOtQ3uczGCYE9w.png?scale-down-to=512)
Object Controls
![](https://framerusercontent.com/images/0WWx3SuiimadKCgy6EEoQ4ypHo.png)
![](https://framerusercontent.com/images/0WWx3SuiimadKCgy6EEoQ4ypHo.png)
![](https://framerusercontent.com/images/0WWx3SuiimadKCgy6EEoQ4ypHo.png)
![](https://framerusercontent.com/images/0WWx3SuiimadKCgy6EEoQ4ypHo.png)
![](https://framerusercontent.com/images/0WWx3SuiimadKCgy6EEoQ4ypHo.png)
![](https://framerusercontent.com/images/0WWx3SuiimadKCgy6EEoQ4ypHo.png)
![](https://framerusercontent.com/images/0WWx3SuiimadKCgy6EEoQ4ypHo.png)
![](https://framerusercontent.com/images/0WWx3SuiimadKCgy6EEoQ4ypHo.png)
![](https://framerusercontent.com/images/0WWx3SuiimadKCgy6EEoQ4ypHo.png)
![](https://framerusercontent.com/images/0WWx3SuiimadKCgy6EEoQ4ypHo.png)
![](https://framerusercontent.com/images/0WWx3SuiimadKCgy6EEoQ4ypHo.png)
![](https://framerusercontent.com/images/0WWx3SuiimadKCgy6EEoQ4ypHo.png)
![](https://framerusercontent.com/images/0WWx3SuiimadKCgy6EEoQ4ypHo.png)
![](https://framerusercontent.com/images/0WWx3SuiimadKCgy6EEoQ4ypHo.png)
![](https://framerusercontent.com/images/0WWx3SuiimadKCgy6EEoQ4ypHo.png)
![](https://framerusercontent.com/images/0WWx3SuiimadKCgy6EEoQ4ypHo.png)
![](https://framerusercontent.com/images/0WWx3SuiimadKCgy6EEoQ4ypHo.png)
![](https://framerusercontent.com/images/0WWx3SuiimadKCgy6EEoQ4ypHo.png)
Precise & Smooth
Built using p5.js, Optimised for Framer;
Render in 30 / 60 / 120 fps
![random gradient image](https://framerusercontent.com/images/ALgsRs3kLKY1K1gdN6y6VMbQ.png?scale-down-to=512)
Lifetime Access
One-time payment for lifetime access to component updates and new variations
Layout Controls
![arrow dynamics framer interface of layout controls](https://framerusercontent.com/images/zjfJUkAA2Ib4aJmZCzsuf7sNQtk.png?scale-down-to=512)
Bring Your Framer Sites to Life with Arrow Dynamics
Experience Arrow Dynamics ✕ Framer throughout this site